﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>LifeCat后台管理系统</title>

    <!--框架引入-->
    <link rel="stylesheet" href="/ssm/static/css/bootstrap/3.3.6/bootstrap.css"/>
    <script type="text/javascript" src="/ssm/static/js/jquery/jquery.min.js"></script>
    <script src="/ssm/static/js/layer/layer.js"></script>
    <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
    <script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

    <link rel="stylesheet" href="/ssm/static/css/view/home.css"/>
</head>

<body>
<div class="container-fluid">
    <!--nav部分-->
    <nav class="navbar navbar-default row no-yj  navbar-fixed-top">
        <div class="container-fluid">

            <!--Left-->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                        data-target="#nav-list-left" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">LifeCat后台管理系统</a>
            </div>

            <!--Right-->
            <div class="collapse navbar-collapse pull-right" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">
                    <!--1、提醒-->
                    <li>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                            <i class="glyphicon glyphicon-bell">
                                <i class="label label-warning label-nav">
                                    66
                                </i>
                            </i>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-right">
                            <li>
                                <a href="#">
                                    提醒
                                </a>
                            </li>
                        </ul>
                    </li>
                    <!--2、通知-->
                    <li>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                            <i class="glyphicon glyphicon-envelope">
                                <i class="label label-success label-nav">
                                    6
                                </i>
                            </i>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-right">
                            <li>
                                <a href="#">
                                    通知
                                </a>
                            </li>
                        </ul>
                    </li>
                    <!--3、资料-->
                    <li>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#" style="height: 50px">
                            <img class="img-circle pull-left img-responsive nav-user-img"
                                 src="/ssm/static/images/user/user.jpg"/>
                            <span class="pull-left nav-username">
                                管理员
                            </span>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-right clearfix" style="padding-top: 0">
                            <li class="user-li-head">
                                <span>
                                    <img class="img-circle nav-user-img-xiala center-block"
                                         src="/ssm/static/images/user/user.jpg"/>
                                </span>
                                <p></p>
                                <p class="text-center">
                                    <span>
                                        LifeCat
                                    </span>
                                </p>
                                <p class="text-center">
                                    <span>
                                        Kevinten
                                    </span>
                                </p>
                                <p class="text-center">
                                    <small>
                                        <span>
                                            2018-07-13
                                        </span>
                                    </small>
                                </p>
                            </li>
                            <li style="padding: 10px 20px 20px;">

                                <div class="pull-left">
                                    <a href="#" class="btn btn-default btn-flat no-yj">
                                        资料
                                    </a>
                                </div>
                                <div class="pull-right">
                                    <a href="#" class="btn btn-default btn-flat no-yj">
                                        注销
                                    </a>
                                </div>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

    <!--body部分-->
    <div class="row" style="margin-top:70px">

        <!--左侧Tap切换栏-->
        <div class="  nav-left col-md-2 no-padding" id="nav-list-left">
            <div class="user-panel">
                <img src="/ssm/static/images/user/user.jpg" class="img-circle center-block"/>
            </div>
            <div class="nav-list">
                <ul>
                    <li>
                        <a id="main-href" href="#">控制盘</a>
                    </li>
                    <li>
                        <a id="admin-href" href="#">管理员</a>
                    </li>
                    <li>
                        <a id="user-href" href="#">用户管理</a>
                    </li>
                    <li>
                        <a id="diary-href" href="#">日记管理</a>
                    </li>
                    <li>
                        <a id="image-href" href="#">图片管理</a>
                    </li>
                </ul>
            </div>
        </div>

        <!--主Tap页面-->
        <div id="main-tap" class="main-right col-md-10 col-md-offset-2 main-tap">
            <div id="home-tap-div" class="col-lg-12 content-div show"></div>
        </div>

    </div>
</div>
</body>

<script type="text/javascript">

    $(document).ready(function () {
        // 初始化加载
        $.ajax({
            url: '/ssm/home-tap/main',
            type: 'GET',
            dataType: "html",
            success: function (html) {
                var text = $('#home-tap-div');
                text.html(html);
            },
            error: function () {
                layer.msg("请求失败:(");
            }
        });

        // 跳转到main
        $('#main-href').on('click', function () {
            $.ajax({
                url: '/ssm/home-tap/main',
                type: 'GET',
                dataType: "html",
                success: function (html) {
                    var text = $('#home-tap-div');
                    text.html(html);
                },
                error: function () {
                    layer.msg("请求失败:(")
                }
            })
        });

        // 跳转到admin
        $('#admin-href').on('click', function () {
            $.ajax({
                url: '/ssm/home-tap/admin',
                type: 'GET',
                dataType: "html",
                success: function (html) {
                    var text = $('#home-tap-div');
                    text.html(html);
                },
                error: function () {
                    layer.msg("请求失败:(")
                }
            })
        });

        // 跳转到user
        $('#user-href').on('click', function () {
            $.ajax({
                url: '/ssm/home-tap/user',
                type: 'GET',
                dataType: "html",
                success: function (html) {
                    var text = $('#home-tap-div');
                    text.html(html);
                },
                error: function () {
                    layer.msg("请求失败:(")
                }
            })
        });

        // 跳转到diary
        $('#diary-href').on('click', function () {
            $.ajax({
                url: '/ssm/home-tap/diary',
                type: 'GET',
                dataType: "html",
                success: function (html) {
                    var text = $('#home-tap-div');
                    text.html(html);
                },
                error: function () {
                    layer.msg("请求失败:(")
                }
            })
        });

        // 跳转到image
        $('#image-href').on('click', function () {
            $.ajax({
                url: '/ssm/home-tap/image',
                type: 'GET',
                dataType: "html",
                success: function (html) {
                    var text = $('#home-tap-div');
                    text.html(html);
                },
                error: function () {
                    layer.msg("请求失败:(")
                }
            })
        });

    });
</script>
</html>

